<template>
	<view>
		<!-- index.wxml -->
		<view class="container">
			<image src="../../static/image/image/logo1.png" alt="logo" class="logo" />
			<view class="contain">
				<view class="u-flex-col">
					<view style="font-size: 36rpx;font-weight: 700;">申请获取以下权限</view>
					<view style="font-size: 24rpx;font-weight: 400;margin-top: 32rpx;">获取您的公开信息（昵称、头像）</view>
					<view style="font-size: 24rpx;font-weight: 400;margin-top: 10rpx;">该小程序仅供公共称重用户使用</view>
					<view style="font-size: 24rpx;font-weight: 400;margin-top: 10rpx;">提示：拒绝登录将无法识别您所在的称重服务商</view>
				</view>

				<view class="loginButton" @click="getUserProfile">微信授权登录</view>
		<!-- 		<button class="loginButton" open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumber"
					v-if="status">获取手机号</button> -->
				<view class="notLoginButton">暂不登录</view>

				<!-- 		
				<view style="font-size: 24rpx;">登录既代表同意<span style="text-decoration:underline"
						@click="intoPage('user')">《用户服务协议》</span>与<span style="text-decoration:underline"
						@click="intoPage('privacy')">《隐私协议》</span></view> -->
			</view>
		</view>
		<image src="https://img.js.design/assets/img/623b205d9411326c7799831a.jpg" class="bg"></image>


		<view style="font-size: 24rpx;position: absolute;bottom: 104rpx;width: 100vw;text-align: center;">登录既代表同意<span
				style="text-decoration:underline" @click="intoPage('user')">《用户服务协议》</span>与<span
				style="text-decoration:underline" @click="intoPage('privacy')">《隐私协议》</span></view>
		<text class="copyright">广东九象技术有限公司@版权所有 2022V3.0</text>
	</view>
</template>

<script>
	import {
		getWxMiniProgramSessionKey,
		wxMiniProgramOauth
	} from '../../common/api.config.js'
	// index.js
	// 获取应用实例
	const app = getApp();
	export default {
		data() {
			return {
				status: 0, // 0授权 1获取手机号
				code: '',
				device_id:''
			};
		},
		onShow() {
			this.getCode()
		},
		methods: {
			intoPage(e){
				if(e == 'user'){
					uni.navigateTo({
						url:'/pages/serviceAgreement/serviceAgreement'
					})
				}else{
					uni.navigateTo({
						url:'/pages/privacyAgreement/serviceAgreement'
					})
				}
			},
			getCode() {
				wx.login({
					success: (res) => {
						console.log(res.code);
						this.code = res.code
					}
				})
			},
			getUserProfile() {
				uni.showLoading({
					title:'请求中~'
				})
				uni.getUserProfile({
					desc: '展示用户信息',
					success:  async (res) => {
						console.log(res);
						var res1 = await getWxMiniProgramSessionKey({
							code:this.code
						})
						console.log(res1);
						const session_key = res1.data.session_key
						const res2 = await wxMiniProgramOauth({
							session_key,
							event:'login',
							encryptedData:res.encryptedData,
							iv:res.iv
						})
						uni.hideLoading()
						console.log(res2);
						if(res2.code == 1){
							uni.setStorageSync('token',res2.data.userinfo.token)
							uni.setStorageSync('user',res2.data.userinfo)
							uni.switchTab({
								url:'/pages/index/index'
							})
						}else{
							uni.showToast({
								title:'登陆失败',
								icon:'none'
							}),
							this.getCode()
						}
					}
				});
			},
			onGetPhoneNumber(e) {
				if (e.detail.errMsg == "getPhoneNumber:fail user deny") {
					//用户拒绝授权  
				} else {
					//允许授权  
					console.log(e.detail)
				}
			}
		}
	};
</script>
<style lang="scss">
	view {
		color: rgba(51, 51, 51, 1);
	}

	.loginButton {
		width: 558rpx;
		height: 84rpx;
		border-radius: 20rpx;
		background: rgba(254, 240, 7, 1);
		color: rgba(0, 0, 0, 1);
		text-align: center;
		line-height: 84rpx;
		margin-top: 68rpx;
	}

	.notLoginButton {
		@extend .loginButton;
		background: rgba(237, 237, 237, 1);
		color: rgba(128, 128, 128, 1);
		margin-top: 32rpx;
	}

	/**index.wxss**/
	.logo {
		width: 556rpx;
		height: 314rpx;
		margin: 223rpx 0 0 97rpx;
	}

	.contain {
		background-color: #fff;
		border-radius: 35rpx;
		margin: 40rpx;
		padding: 62rpx;
		/* text-align: center; */
		box-shadow: 1rpx 1rpx 25rpx #00000011;
		color: #656565;
	}

	.icon {
		width: 28rpx;
		height: 32rpx;
		padding-top: 20rpx;
	}

	.wxicon {
		width: 38rpx;
		height: 30rpx;
		padding-right: 10rpx;
	}

	.loginform {
		display: flex;
		border-bottom: 1rpx solid #b8b8b8;
		padding: 10rpx 0;
	}

	.loginform>input {
		height: 66rpx;
		line-height: 66rpx;
		text-align: left;
		padding-left: 20rpx;
		font-size: 30rpx;
	}

	.sysTitle {
		font-size: 48rpx;
		text-align: center;
	}

	.sysText {
		font-size: 24rpx;
		text-align: center;
		margin: 10rpx 0 60rpx 0;
	}

	button {
		border-radius: 15rpx !important;
		font-size: 32rpx !important;
		/* padding: 40rpx 0; */
		margin: 42rpx 0;
		width: 100% !important;
		color: #808080;
	}

	.loginbtn {
		background-color: #fdf03f;
		color: #000;
	}

	.otherbtnbox {
		display: flex;
		justify-content: space-between;
	}

	.otherbtnbox button {
		background-color: #efefef;
		color: #8a8a8a;
	}

	.copyright {
		position: absolute;
		bottom: 70rpx;
		font-size: 24rpx;
		width: 100vw;
		text-align: center;
		color: rgba(128, 128, 128, 1);
		font-size: 16rpx;
	}

	.bg {
		position: absolute;
		top: 0;
		z-index: -99;
		width: 100%;
		height: 100%;
		border-bottom-left-radius: 35rpx;
		border-bottom-right-radius: 35rpx;
	}
</style>
